<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>window_base</title>
    <link rel="stylesheet" type="text/css" href="/easyui.css">
    <link rel="stylesheet" type="text/css" href="/icon.css">
    <link rel="stylesheet" type="text/css" href="/demo.css">
    <script src="/jquery.min.js"></script>
    <script src="/jquery.easyui.min.js"></script>
    <style type="text/css">
        .c2,.c2:hover,.c2>.panel-header{
            color: #fff;
            border-color: #5f5f5f;
            background: #747474;
            background: -webkit-linear-gradient(top,#747474 0,#676767 100%);
            background: -moz-linear-gradient(top,#747474 0,#676767 100%);
            background: -o-linear-gradient(top,#747474 0,#676767 100%);
            background: linear-gradient(to bottom,#747474 0,#676767 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#747474,endColorstr=#676767,GradientType=0);
        }
        a.c2:hover{
            background: #676767;
            filter: none;
        }
        .c2>.panel-body{
            border-color: #5f5f5f;
        }
        .c2>.dialog-toolbar,.c2>.dialog-button{
            border-left-color: #5f5f5f;
            border-right-color: #5f5f5f;
        }
        .c2>.dialog-button{
            border-bottom-color: #5f5f5f;
        }
    </style>
</head>
<body>
<h2>Basic Window</h2>
<p>Window can be dragged freely on screen.</p>
<div style="margin:20px 0;">
    <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('open')">Open</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('close')">Close</a>
</div>
<div id="w" class="easyui-window" >
    The window content.
</div>

<script type="text/javascript">
    $("#w").window({
        width:500,
        height:200,
        title:"Basic Window",
        modal:true,
        shadow:true,
//        inline:true,
        tools:"#tt",
        cls:'c2X'
    });
</script>
<div id="tt">
    <a href="javascript:void(0)" class="icon-add" onclick="javascript:alert('add')"></a>
    <a href="javascript:void(0)" class="icon-edit" onclick="javascript:alert('edit')"></a>
    <a href="javascript:void(0)" class="icon-cut" onclick="javascript:alert('cut')"></a>
    <a href="javascript:void(0)" class="icon-help" onclick="javascript:alert('help')"></a>
</div>





</body>
</html>